<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动场景1：图片与文字环绕</title>
		<style>
			img{
				/* 图片脱离文档流--文字包含在图片周边 */
				float: left;
				margin-right: 50px; /* 图片与文字链接处间隙*/
				margin-bottom: 50px;/* 图片与文字链接处间隙*/
			}
			p{
				font-size: 16px;/* 页面默认字体尺寸 */
				iline: height 20px;/* 浮动文字，行高无法设定 */
				word-spacing: 20px;
			}
		</style>
	</head>
	<body>
		<h1>浮动之图片文字环绕</h1>
		<img src="img/th.jpg" alt="牢大" width="250px" height="250px" />
		<p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Maxime aliquid iste repudiandae, dolorum a explicabo in eveniet obcaecati, temporibus corporis quae! Est totam eaque cupiditate sit corporis aspernatur blanditiis dolorem! Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam molestiae non accusamus similique illo ratione eaque inventore sequi cum autem dicta, necessitatibus laborum ad in nulla temporibus error reiciendis vel?Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia in illum harum beatae laudantium a recusandae quidem esse dolores, nam quae officiis ipsa laborum? Harum debitis earum quis libero minus.</p>
	</body>
</html>